import axios from 'axios'
import store from '@/store'
import router from '@/router'
import { Message, Loading } from 'element-ui'
export const baseURL = 'http://big-event-vue-api-t.itheima.net'
const request = axios.create({
  // 配置请求的基准URL地址
  baseURL: baseURL,
})
let loadingInstance = null
// 配置请求拦截器
request.interceptors.request.use(
  (config) => {
    // 全屏展示Loading效果
    loadingInstance = Loading.service({ fullscreen: true })
    // 当登录后 才会有token值 这时候再在每次请求头部上添加token
    if (store.state.token) {
      config.headers.Authorization = store.state.token
    }

    return config
  },
  (error) => {
    return Promise.reject(error)
  }
)

// 配置响应拦截器
request.interceptors.response.use(
  (response) => {
    // 响应http状态码为 2xx或3xx 时触发成功的回调 形参中的response是“成功的结果”
    // return到axios原地Promise对象 作为成功的结果
    loadingInstance.close()
    return response
  },
  (error) => {
    // 响应http状态码为 4xx或5xx 时触发失败的回调 形参中的error是“失败的结果”
    // console.dir(error)
    loadingInstance.close()
    if (error.response.status === 401) {
      // 本次响应是token过期了
      // 清除vuex里的一切 然后强制跳转到登录页面
      Message.error('用户身份已过期！请重新登录！')
      router.push('/login')
    }
    return Promise.reject(error)
  }
)
export default request
